<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.org/thymeleaf/shiro">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>车辆状态</title>
    <link rel="stylesheet" th:href="@{/resources/layui/css/layui.css}">
</head>
<body>
<script th:src="@{/resources/layui/layui.js}"></script>
<script th:inline="none">
    //一般直接写在一个js文件中
    layui.use(['layer', 'form','table'], function() {
            var layer = layui.layer,
                form = layui.form,
                table = layui.table,
                $ = layui.jquery;
            $.ajax({
                type:"get",
                url:"/vehiclefiles/selectVehicleAll",
                success:function(resp){
                    console.log(resp.data.vehiclefilesList);
                    var vehiclefilesList=resp.data.vehiclefilesList;
                    for(var i=0;i<vehiclefilesList.length;i++){
                        if(vehiclefilesList[i].status.id==19){
                            $("#mytr").append("<td><div><img src='"+vehiclefilesList[i].frontimg+"' width='200px' height='100px'></div><div>"+vehiclefilesList[i].vehiclenum+"</div><div>【状态：可用】</div></td>");
                        }else if(vehiclefilesList[i].status.id==20){
                            $("#mytr2").append("<td><div><img src='"+vehiclefilesList[i].frontimg+"' width='200px' height='100px'></div><div>"+vehiclefilesList[i].vehiclenum+"</div><div>【状态：出车】</div></td>");
                        }else if(vehiclefilesList[i].status.id==21){
                            $("#mytr3").append("<td><div><img src='"+vehiclefilesList[i].frontimg+"' width='200px' height='100px'></div><div>"+vehiclefilesList[i].vehiclenum+"</div><div>【状态：维修】</div></td>");
                        }else if(vehiclefilesList[i].status.id==22){
                            $("#mytr4").append("<td><div><img src='"+vehiclefilesList[i].frontimg+"' width='200px' height='100px'></div><div>"+vehiclefilesList[i].vehiclenum+"</div><div>【状态：其他】</div></td>");
                        }else if(vehiclefilesList[i].status.id==32){
                            $("#mytr5").append("<td><div><img src='"+vehiclefilesList[i].frontimg+"' width='200px' height='100px'></div><div>"+vehiclefilesList[i].vehiclenum+"</div><div>【状态：备用】</div></td>");
                        }
                    }
                }
            });
        });
</script>
<table style="margin: 10px" cellspacing="20px" cellpadding="20px">
    <tr id="mytr" class="trt"></tr>
    <tr id="mytr2" class="trt"></tr>
    <tr id="mytr3" class="trt"></tr>
    <tr id="mytr4" class="trt"></tr>
    <tr id="mytr5" class="trt"></tr>
</table>

</body>
</html>